@charset "utf-8";
@import "common/run";
.web {
    .top {
        position: absolute;
        top: r(41px);
        left: 0;
        right: 0;
        margin: 0 auto;
        z-index: 2;
        width: r(318px);
        height: r(45px);
    }
    .center {
        position: absolute;
        top: r(86px);
        left: 0;
        right: 0;
        margin: 0 auto;
        z-index: 3;
        width: r(500px);
        height: r(827px);

        .mypaiming {
            position: absolute;
            bottom: 0;
            left: 0;
            z-index: 99;
            background: #e7c598;
        }
        ul {
            position: absolute;
            top: 0;
            left: 0;
            overflow-y: overlay;
            width: 100%;
            height: 0;
            box-sizing: border-box;
            //          overflow-y:overlay;
            li:nth-child(1),
            li:nth-child(2),
            li:nth-child(3) {
                div {
                    color: #e7c598;
                }
            }
            li .num em {
                display: block;
                width: r(19px);
                height: r(11px);
                position: absolute;
                top: r(17px);
                left: 0;
                right: 0;
                margin: 0 auto;
            }
            li:nth-child(1) .num em {
                background: url("../images/ranking/diyiming.png") no-repeat center center/cover;
            }
            li:nth-child(2) .num em {
                background: url("../images/ranking/dierming.png") no-repeat center center/cover;
            }
            li:nth-child(3) .num em {
                background: url("../images/ranking/disanming.png") no-repeat center center/cover;
            }

        }
        .mypaiming,
        li {
            box-sizing: border-box;
            width: r(498px);
            height: r(92px);
            line-height: r(92px);
            border: 1px solid #e7c397;
            div {
                color: #fbf4f5;
                font-size: r(22px);
            }
            .num {
                position: relative;
                float: left;
                width: r(98px);
                height: 100%;
                text-align: center;
                font-size: r(30px);
                font-weight: 800;
            }
            .img {
                float: left;
                width: r(46px);
                height: 100%;
                border-radius: 50%;
                img {
                    width: r(46px);
                    height: r(46px);
                    margin-top: r(22px);
                    border-radius: 50%;
                }
            }
            .name {
                float: left;
                width: r(180px);
                height: 100%;
                padding-left: r(10px);
                font-size: r(20px);
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .shu {
                float: right;
                text-align: right;
                margin-right: r(41px);
                width: r(120px);
                height: 100%;
            }
        }
    }
}
